.device {
  display: flex;
  height: 100%;
  .device-left {
    flex: 1;
    background: url('./img/line_box.png') no-repeat;
    height: 88%;
    background-size: 100% 100%;
    padding: 24px 40px;
    margin-top: 25px;
  }
  .title {
    font-size: 24px;
    font-weight: bold;
    margin-bottom: 16px;
    color: #29fcff;
  }
  .device-right {
    flex: 1;
    background: url('./img/line_box1.png') no-repeat;
    background-size: 100% 100%;
    margin-top: 25px;
    height: 88%;
    padding: 24px 26px;
    .statistic-content {
      color: #fff;
      text-align: left;
      font-size: 24px;
      .list-wrap {
        background: #dfdfdf0f;
        border-radius: 10px;
        padding: 15px 12px;
      }
      .statistic-data {
        display: flex;
        align-items: center;
        gap: 70px;
        font-size: 20px;
        .data-item-wrap {
          display: flex;
          justify-content: space-between;
        }
      }
    }
  }

  .device-center {
    flex: 2;
    .device-center-one {
      margin: 80px 24px 0 24px;
      .center-one-content {
        display: flex;
        padding: 24px;
        align-items: center;
        .char {
          display: flex;
          align-items: center;
          justify-content: center;
        }
      }
    }
  }
  .img-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 35%;
  }
  .device-item {
    display: flex;
    align-items: center;
    color: #fff;
    background: #dfdfdf0f;
    border-radius: 10px;
    padding: 15px 0;
    .device-img {
      width: 50px;
      height: 50px;
      text-align: center;
      .iconfont {
        width: 100%;
        height: 100%;
        text-align: left;
        text-indent: 30px;
        line-height: 50px;
        font-size: 40px;
        font-weight: bolder;
        position: relative;
        background-image: -webkit-linear-gradient(
          bottom,
          #407bdb,
          #61dafb,
          #29fcff
        );
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
      }
    }
  }
}

.font-size-24 {
  font-size: 24px;
}
.font-size-20 {
  font-size: 20px;
}
.pr-30 {
  padding-right: 30px;
}
.mr-60 {
  margin-right: 60px;
}
.mr-20 {
  margin-right: 20px;
}
.mb-60 {
  margin-bottom: 60px;
}
.mb-40 {
  margin-bottom: 40px;
}
.mb-20 {
  margin-bottom: 16px;
}
.primary-color {
  color: #29fcff;
}
.mb-8 {
  margin-bottom: 8px;
}
